<template>
	<view class="main">
		
		<view class="main-text"> 选择你的居住城市 </view>
		<view class="second-text">优先给你推荐本地的异性</view>
		
		<view class="position-1">
			<image src="../../static/images/position_2.png" mode="widthFix"></image>
		</view>
		
		<view class="position-2">
			<view class="position-2-inner" @tap="position">
				<image src="../../static/images/position_1.png" mode="widthFix"></image>
				<view>快速获取定位</view>
			</view>
		</view>
		
		
		<view class="next-bt" :class="active ? 'active': ''" @tap="finish">完成</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				sex: 0,
				birthday: "",
				city_code: "",
				poi_name: "",
				street_num: "",
				street: "",
				district: "",
				city: "",
				province: "",
				latitude: "",
				longitude: "",
				active: false,
			}
		},
		onLoad(option) {
			this.sex = option.sex;
			this.birthday = option.birthday;
		},
		methods: {
			async finish(){
				let __this = this;
				uni.getLocation({
				    type: 'gcj02',
					geocode: true,
				    success: function (res) {
				        console.log(res);
						__this.initAddress(res);
				    }
				});
				
				let [err,res] = await this.$http.post('User/update',{
					sex: this.sex,
					birthday: this.birthday,
					city_code: this.city_code,
					poi_name: this.poi_name,
					street_num: this.street_num,
					street: this.street,
					district: this.district,
					city: this.city,
					province: this.province,
					latitude: this.latitude,
					longitude: this.longitude,
					init:1,
				});
				
				if(!this.$http.errorCheck(err,res)){
					return;
				}
				
				this.User.userinfo.user_icon = res.data.data.user_icon
				this.User.userinfo.sex = this.sex;
				this.User.userinfo.birthday = this.birthday;
				uni.setStorageSync("userinfo", this.User.userinfo);
				
				uni.switchTab({ url:"/pages/index/meet" });
				uni.$emit('first_meet',{})
			},
			position(){
				let __this = this;
				uni.getLocation({
				    type: 'gcj02',
					geocode: true,
				    success: function (res) {
				        console.log(res);
						__this.initAddress(res);
				    }
				});
				
				this.active = true;
			},
			initAddress(address){
				this.city_code = address.address.cityCode;
				this.poi_name = address.address.poiName;
				this.street_num = address.address.streetNum;
				this.street = address.address.street;
				this.district = address.address.district;
				this.city = address.address.city;
				this.province = address.address.province;
				this.latitude = address.latitude;
				this.longitude = address.longitude;
			}
		}
	}
</script>

<style lang="scss" scoped>

.main-text{
	font-size: 40rpx;
	font-weight: bold;
	margin-top: 200rpx;
	text-align: center;
}
.second-text{
	margin-top: 20rpx;
	font-size: 28rpx;
	text-align: center;
	color: #515151;
}
.position-1{
	margin-top: 150rpx;
	text-align: center;
	image{
		width: 80rpx;
	}
}
.position-2{
	margin-top: 50rpx;
	.position-2-inner{
		margin: 0 auto;
		display: flex;
		justify-content:center;
		align-items:center;
		border: 5rpx solid #E6E6E6;
		height: 100rpx;
		width: 300rpx;
		border-radius: 50rpx;
		
		image{
			width: 60rpx;
		}
		view{
			font-size: 30rpx;
		}
	}
}


.next-bt{
	position: fixed;
	bottom: 100rpx;
	width: 500rpx;
	margin: auto;
	left: 0;
	right: 0;
	text-align: center;
	font-weight: bold;
	height: 80rpx;
	line-height: 80rpx;
	border-radius: 50rpx;
	background-color: #E6E6E6;
	
}
.active{
	background-color: #7AE8D1 !important;
}
</style>
